<template>
	<!-- 问题五 -->
		<a-modal
			title="产品列表"
			:width="1200"
			:visible="visible"
			:confirmLoading="confirmLoading"
			:footer="null"
			:maskClosable="false"
			@ok="handleSubmit"
			@cancel="handleCancel">
	
			<a-spin :spinning="confirmLoading">
				<a-form :form="form">
					<a-row>
						<a-col :span="24">
							<!-- 22--{{ materialCalculationResults }} -->
							<a-table
								ref="table"
								size="default"
								:columns="columns"
								:data-source="materialCalculationResults"
								:pagination="false"
							>
							<span slot="remark" slot-scope="text, record">
								<a-tooltip placement="topLeft" :title="record.material.remark">
									{{record.material.remark || '--'}}
								</a-tooltip>
							</span>
						</a-table>
						</a-col>
					</a-row>
				</a-form>
			</a-spin>
		</a-modal>
	</template>
	
	<script>
	import {page} from '@/api/modular/main/emsordermaterial/emsOrderMaterialManage'
	import {STable} from '@/components'
	
	export default {
		components: {
			STable,
		},
		data() {
			return {
				labelCol: {
					xs: {span: 24},
					sm: {span: 5}
				},
				wrapperCol: {
					xs: {span: 24},
					sm: {span: 15}
				},
				labelColBlock: {
					xs: {span: 24},
					sm: {span: 2}
				},
				wrapperColBlock: {
					xs: {span: 24},
					sm: {span: 20}
				},
				visible: false,
				confirmLoading: false,
				form: this.$form.createForm(this),
				columns: [
					{
						title: '序号', width:'80px',
						dataIndex: 'index',
						customRender: (text, record, index) => `${index + 1}`
					},
					{
						title: '产品名称',
						dataIndex: 'materialName'
					},
					{
						title: '数量',
						dataIndex: 'number'
					},
					{
						title: '软件版本号',
						dataIndex: 'extend2'
					},
					{
						title: '已生产数量',
						dataIndex: 'completedNumber'
					},
					{
						title: '已入库数量',
						dataIndex: 'inStoreNumber'
					},
					{
          title: '备注',
          dataIndex: 'remark',
          ellipsis: true,
          scopedSlots: {customRender: 'remark'}
        },
				],
				orderIds: '',
				sysOrgs: [],
				fileList: [],
				orgTree: [],
				materialCalculationResults: [],
				materialType: this.$businessEnum.MATERIAL_TYPE_ENUM.material.id,
			}
		},
		methods: {
			init(record, materialType) {
				this.visible = true
				this.confirmLoading = true
				this.orderIds = record
				page({orderId: this.orderIds, materialType}).then((res) => {
					this.confirmLoading = false
					this.materialCalculationResults = res.data.rows
				})
			},
			handleSale(record){
			 // console.log(record)
			 this.$refs.toPoolForm.add(record)
				
			},
			handleSubmit() {
				
			},
			handleCancel() {
				this.form.resetFields()
				this.visible = false
			},
		}
	}
	</script>
	